import Button from './button'
// 状态提升  就某些组件的共用状态 直接提升成 都组建的状态，在父传子传给这些子组件
function List(props) {
  let { data = [], render, onDel } = props;
  return <ul>
    {
      data.map(item => {
        if (typeof render == 'function') {
          return <li key={item.id}>{render(item)}</li>
        } else {
          return <li key={item.id}>{item.val} <Button onClick={() => onDel(item.id)}>X</Button></li>
        }

      })
    }
  </ul>
}

export default List